<!--
 * @Author: zhangxiangsheng 1026583651@qq.com
 * @Date: 2024-06-17 15:04:34
 * @LastEditors: zhangxiangsheng 1026583651@qq.com
 * @LastEditTime: 2024-06-21 15:46:53
 * @FilePath: \appGly\components\formz\components\timepicker.vue
 * @Description: 
 * 
 * Copyright (c) 2024 by ${git_name_email}, All Rights Reserved. 
-->
<template>
  <view class="">
    <!-- {{ item }} -->
    <u-form-item
      :label="item.label"
      :prop="item.value"
      borderBottom
      ref="item1"
    >
      <u-button
        :text="btntext || $z.$t('请选择')"
        :hairline="false"
        :customStyle="btnstyle"
        @click="show = true"
      ></u-button>
    </u-form-item>
    <u-picker
      :show="show"
      ref="uPicker"
      :loading="loading"
      :columns="columnsxs"
      @change="changeHandler"
      @confirm="confirm"
      @cancel="close"
    ></u-picker>
  </view>
</template>

<script>
  export default {
    props: {
      item: {
        typeof: Object,
        default: () => {
          return {};
        },
      },
      data: {
        typeof: Object,
        default: () => {
          return {};
        },
      },
    },
    data() {
      return {
        show: false,
        loading: false,
        indexs: [0, 0, 0, 0, 0],
        btnstyle: {
          border: "none",
          padding: "0",
          justifyContent: "flex-start",
        },
      };
    },
    computed: {
      columnsxs() {
        let h1 = [];
        for (let index = 0; index <= 24; index++) {
          let str = index < 10 ? `0${index}` : index;
          h1.push(str);
        }
        let m1 = [];
        m1.push("00");
        if (this.indexs[0] != h1.length - 1) {
          m1.push("30");
        }
        let h2 = [],
          index2 = this.indexs[1] == 1 ? this.indexs[0] + 1 : this.indexs[0];
        for (let index = index2; index <= 24; index++) {
          let str = index < 10 ? `0${index}` : index;
          h2.push(str);
        }
        let m2 = [];
        m2.push("00");
        if (this.indexs[3] != h2.length - 1) {
          m2.push("30");
        }
        return [h1, m1, ["-"], h2, m2];
      },
      btntext() {
        let modelValues = this.item.modelValues;
        let h1 = modelValues.find((e) => {
          return e.type == "h1";
        });
        let m1 = modelValues.find((e) => {
          return e.type == "m1";
        });
        let h2 = modelValues.find((e) => {
          return e.type == "h2";
        });
        let m2 = modelValues.find((e) => {
          return e.type == "m2";
        });
        h1 = this.data[h1.value] || 0;
        h1 = h1 < 10 ? `0${h1}` : h1;
        h2 = this.data[h2.value] || 0;
        h2 = h2 < 10 ? `0${h2}` : h2;
        m1 = this.data[m1.value] || 0;
        m2 = this.data[m2.value] || 0;
        m1 = m1 < 10 ? `0${m1}` : m1;
        m2 = m2 < 10 ? `0${m2}` : m2;
        return `${h1}:${m1}-${h2}:${m2}`;
      },
    },
    watch: {},
    methods: {
      changeHandler(e) {
        this.indexs = e.indexs;
      },
      close() {
        console.log(123456);
        this.show = false;
      },
      confirm(e) {
        let modelValues = this.item.modelValues;
        let unpdatev = {};
        let v = e.value;
        modelValues.forEach((element) => {
          if (element.type == "h1") {
            unpdatev[element.value] = String(Number(v[0]));
          } else if (element.type == "m1") {
            unpdatev[element.value] = String(Number(v[1]));
          } else if (element.type == "h2") {
            unpdatev[element.value] = String(Number(v[3]));
          } else if (element.type == "m2") {
            unpdatev[element.value] = String(Number(v[4]));
          }
        });
        this.$emit("update:data", {
          ...this.data,
          ...unpdatev,
        });
        this.show = false;
      },
    },
  };
</script>

<style lang="scss">
  .dw {
    color: #2093f5;
  }
</style>
